<template>
  <div class="wrap_404">
    <div>
      <img src="~@/assets/images/404.png" alt="404"/>
      <!-- <h1>404</h1> -->
      <p>您的账号无权限访问该页面，请联系管理员</p>
      <div class="btn" @click="goback">回到首页<i class="el-icon-right"></i></div>
    </div>
  </div>
</template>

<script>
export default {
  created() {},
  methods: {
    goback() {
      this.$router.push({
        path: '/'
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.wrap_404 {
  height: 100vh;
  display: flex;
  justify-items: center;
  justify-content: center;
  align-content: center;
  flex-wrap: wrap;
  text-align: center;
  h1{
    font-size: 200px;
    line-height: 1em;
    padding: 0;
    margin: 0;
  }
  img {
    display: block;
    width: 500px;
    margin: 30px 0;
  }
  p {
    width: 100%;
    font-size: 20px;
    color: #666;
  }
  .btn{
    display: inline-block;
    cursor: pointer;
    padding: 10px 20px;
    border-radius: 4px;
    color: rgb(97, 184, 255);
    &:hover{
      color: rgb(59, 166, 253);
      background-color: rgba(59, 166, 253, 0.137);
    }
  }
}
</style>
